<template lang="html">
<div class="page">
  <cube-scroll ref="scroll" :options="{scrollbar:{fade:true}}">
    <div class="title-bar">
      <h2>{{info.Title}}</h2>
      <p>{{info.Description}}</p>
    </div>
    <div class="flex bg-white line-top p-md">
      <avatar :src="info.Avatar" class="mr"></avatar>
      <div class="f-body">
        <div class="fs-sm tc-grey">{{info.Name}}</div>
        <div class="desc flex jc-sb">
          <p class="left">部门：{{info.DeptName}}</p>
          <span>{{ info.CreateTime | formatDate('yyyy-MM-dd hh:mm:ss')}}</span>
        </div>
      </div>
    </div>
    <tit has-bg class="mt-md">填写信息</tit>
    <div class="p-md bg-white">
      <cube-textarea v-model="Content" placeholder="输入您要处理的内容" :maxlength="250"></cube-textarea>
      <!--<h4 class="title mt-lg">上传照片</h4>
      <cube-upload :action="action"
                   :simultaneous-uploads="1"
                   :process-file="processFile"
                   @file-submitted="fileSubmitted" />

      <h4 class="title mt-lg">上传视频</h4>
      <div class="upload-row flex">
        <btn icon="icon-recordfill" type="warn" ></btn>
        <div class="f-body pl">
          <el-row :gutter="10" >
            <el-col :span="8" v-for="(item,index) in List" :key="index+Math.random()" v-if="index<3">
              <g-item :thum-src="item.CoverImage" img-height="60" is-video href="/"></g-item>
            </el-col>
          </el-row>
        </div>
      </div>

      <uploader :options="options" class="upload-files">
        <uploader-unsupport>对不起，不支持上传该格式文件</uploader-unsupport>
        <uploader-btn>上传视频</uploader-btn>
        <uploader-list></uploader-list>
      </uploader>-->
    </div>
    <div class="btn-wrap">
      <btn type="primary" size="lg" block @click.native="submitForm(1)" v-if="step.StepType==1">提交办理信息</btn>
      <btn type="primary" size="lg" block @click.native="submitForm(1)" v-if="step.StepType==2">同意，提交办理信息</btn>
      <btn type="warn" size="lg" block @click.native="submitForm(2)" v-if="step.StepType==2">不同意，提交办理信息</btn>
      <btn block size="lg" :link="'/home/zybl/'+id">转移办理</btn>
    </div>
  </cube-scroll>

</div>
</template>

<script>
import compress from '@/common/image.js'
export default {
  data() {
    return {
      List: [],
      id:0,
      info:{},
      step:{},
      checkinfo:{},
      Content:'',
      options: {
        target: '//jsonplaceholder.typicode.com/photos/',
        testChunks: false
      },
      action: {
        target: '//jsonplaceholder.typicode.com/photos/',
        prop: 'base64Value'
      }
    }
  },
  created () {
    //this.getListData();
    this.id = this.$route.params.id;
    this.getInfo();
  },
  methods : {
    getInfo() {
      this.$http.get("app/Handler/DispatchHandler.ashx?action=Get&Id=" + this.id)
      .then(data => {
        console.log(data);
        if(data.code == 0){
          this.info = data.data;
          this.step = data.step;
          this.checkinfo = data.check;
        }
      })	 
    },
    submitForm(state){
      if(this.Content==""){
        this.$createToast({
          txt:  "处理信息不能为空！",
          type: 'warn'
        }).show();
        return;
      }
      let params = {
        Id: this.checkinfo.Id,
        DispatchId: this.id,
        CheckState: state,
        CheckAdvice: this.Content
      };
      console.log(params);
      const toast = this.$createToast({
        txt: '提交中...',
        mask: true
      });
      toast.show()
      this.$http.post('app/Handler/DispatchHandler.ashx?action=Check', params)
        .then(data => {
          console.log(data);  
          if(data.code == 0) {
            toast.hide();
            this.$createToast({
              txt: '数据提交成功！',
              type: 'correct'
            }).show();
            this.$router.push('/home/detail/'+this.id);
          }else{
            this.$createToast({
              txt:  data.msg,
              type: 'warn'
            }).show();
          }
        })
    },
    getListData() {
      this.id = this.$route.params.id
      this.axios.get('https://jason588.github.io/data.json').then((res) => {
        this.List = res.data.List
        this.info = res.data.List[this.id]
      })
    },
    processFile(file, next) {
      compress(file, {
        compress: {
          width: 1600,
          height: 1600,
          quality: 0.5
        }
      }, next)
    },
    fileSubmitted(file) {
      file.base64Value = file.file.base64
    }

  },
}
</script>

<style lang="stylus">
@import "assets/stylus/base"
.upload-row
  .btn
    height: 60px;
    .icon
      font-size: 28px



</style>
